<!--
  Target for toggling the sidebar `.sidebar-checkbox` is for regular styles, `#sidebar-checkbox` for
  behavior.
-->
<input type="checkbox" class="sidebar-checkbox" id="sidebar-checkbox">

<!-- Toggleable sidebar -->
<aside class="sidebar" id="sidebar">
  <div class="sidebar-item">
    <p>{{ site.description }}</p>
  </div>

  <nav class="sidebar-nav">
    <a class="sidebar-nav-item{% if page.url == site.baseurl %} active{% endif %}" href="{{ site.baseurl }}/">Home</a>

    {% comment %}
      The code below dynamically generates a sidebar nav of pages with
      `layout: page` in the front-matter. See readme for usage.
    {% endcomment %}

    {% assign pages_list = site.pages | sort:"url" %}
    {% for node in pages_list %}
      {% if node.title != null and node.url != "/404.html" %}
        {% if node.layout == "page" %}
          <a class="sidebar-nav-item{% if page.url == node.url %} active{% endif %}" href="{{ site.baseurl }}{{ node.url }}">{{ node.title }}</a>
        {% endif %}
      {% endif %}
    {% endfor %}

    <!-- The code below is used for manually entered links  -->
    <span style='cursor:pointer;' onclick="javascript:var hypothesis = document.createElement('script');
      hypothesis.setAttribute('src','https://hypothes.is/embed.js');
      document.head.appendChild(hypothesis);"><a class="sidebar-nav-item">Annotate me</a></span>

  <!--
    <a class="sidebar-nav-item" href="https://via.hypothes.is/{{ site.url }}{{ site.baseurl }}{{page.url}}/" data-proofer-ignore>Annotate me</a>
    <script src="https://hypothes.is/embed.js" async></script>
  -->

    <a class="sidebar-nav-item" href="https://github.com/minicomp/ed" target="_blank">GitHub project</a>
  </nav>

  <div class="sidebar-item">
    <p>
      Built with <a href="https://minicomp.github.io/ed/">Ed.</a> Distributed under an MIT license.
    </p>
  </div>
</aside>
